<template>
	<view class="container">
		<view class="avatarBox">
			<uni-icons type="camera-filled" size="30" color="#1b6ef3" @click="onChooseAvatar"
				style="position: absolute;top: 38px;left: 30px;z-index: 99;"></uni-icons>
			<image @click="onChooseAvatar" class="avatar-wrapper"
				:src="userInfo.UserAvatarURL?userInfo.UserAvatarURL:userUrl" mode="aspectFit"></image>
			<view class="infoBox">
				<view class="user" @click="toEditUserInfo('用户名',userInfo.UserName)">
					{{userInfo.UserName}} <uni-icons type="forward"></uni-icons>
				</view>
				<view class="">
					完善实名信息
				</view>
			</view>
		</view>
		<uni-list style="">
			<uni-list-item clickable @click="toEditUserInfo('手机号变更',userInfo.UserPhone)" showArrow title="手机号变更"
				:rightText="userInfo.UserPhone" />
			<uni-list-item showArrow title="身份证号" clickable @click="toEditUserInfo('身份证号')"
				:rightText="idCardPass(userInfo.idCard)" />
			<!-- <uni-list-item clickable @click="toRealShop" showArrow title="商铺认证"
				:rightText="(CompanyInfo.CardPhoto==null || CompanyInfo.CardPhoto==='')?'待认证':CompanyInfo.Title" /> -->
			<uni-list-item clickable @click="toAuthentication" showArrow title="实名认证" rightText="待认证" />
			<!-- <uni-list-item clickable @click="appprivacy(0)" showArrow title="隐私政策" /> -->
			<uni-list-item clickable @click="appprivacy(1)" showArrow title="服务协议" />
			<uni-list-item clickable @click="cancellation" showArrow title="注销账号" />
		</uni-list>
		<button style="margin-top: 40px;" type="warn" @click="logOut">退 出 登 录</button>
		
		<view class="version">
			v 1.0.0
		</view>
	</view>
</template>

<script>
	const idCardPass = (text) => {
		if (text) {
			let a = text.split('')
			a.splice(6, 8, '********')
			return a.join('')
		} else {
			return '请认证身份证信息'
		}
	}
	export default {
		components: {},
		data() {
			return {
				userInfo: {},
				userUrl: 'https://hzq.yoojet.com/logo200.png',
				CompanyInfo: {},
				vers: '1.0.0',
				idCardPass
			}
		},
		onLoad() {

		},
		onShow() {
			// 获取用户信息
			this.op()
			this.CommpayInfo = uni.getStorageSync('CompanyInfo')
			this.userInfo = uni.getStorageSync('userInfo')
			// #ifdef APP-PLUS
			this.vers = plus.runtime.version
			// #endif
			this.getCompanyInfo()

		},
		methods: {
			upload(){
			   console.log('上传了',)
			   this.$upload.uploadImageOne('/Base_Manage/Upload/UploadFileProductByForm', function(res) {
					console.log('是否上传成功了', res);
					// that.pics.push(res.data.path);
				});
		    },
			// 获取公司信息
			getCompanyInfo() {
				// this.$http("post", "/Base_Manage/Base_Company/GetDataCompanyData", {
				// 		Search: {
				// 			condition: "CreatorId",
				// 			keyword: this.userInfo.Id,
				// 		},
				// 	})
				// 	.then((res) => {
				// 		console.log('获取公司信息', res);
				// 		if (res.Success && res.Data.length > 0) {
				// 			this.CompanyInfo = res.Data[0];
				// 			uni.setStorageSync('CompanyInfo', this.CompanyInfo)
				// 		}
				// 	});
			},
			op() {
				// this.$http('post', '/Base_Manage/Home/GetOperatorInfo').then(res => {
				// 	if (res.Success) {
				// 		console.log('获取用户信息===', res.Data)
				// 		// if(res.Data.UserInfo.BusinessLicense){
				// 		// 	console.log('获取营业执照', res.Data.UserInfo.BusinessLicense)
				// 		// 	this.fileList=[]
				// 		// 	this.fileList.push(res.Data.UserInfo.BusinessLicense)
				// 		// 	// 隐藏上传区域
				// 		// 	this.uploadFlag=false
				// 		// 	// 隐藏商铺认证按钮
				// 		// 	this.isAuthentication=true
				// 		// }
				// 		uni.setStorageSync('userInfo', res.Data.UserInfo)

				// 	}
				// })
			},
			// 商铺认证
			toRealShop() {
				let obj = JSON.stringify(this.CompanyInfo)
				uni.navigateTo({
					url: '/pages/User/RealShop?CompanyInfo=' + obj
				})
			},
			// 实名认证
			toAuthentication() {
				uni.navigateTo({
					url: '/pages/User/RealName'
				})
			},
			//隐私政策/服务协议
			appprivacy(val) {
				uni.navigateTo({
					url: '/pages/User/customerPage?Type=' + val
				})

			},
			// 留言反馈
			feedback() {
				uni.navigateTo({
					url: '/pages/user/feedback'
				})
			},
			// 注销
			cancellation() {
				uni.navigateTo({
					url: '/pages/User/cancellation'
				})
			},
			// 修改个人信息
			toEditUserInfo(type, name) {
				let url = ''
				if (type == '用户名') url =
					`type=text&value=${this.userInfo.UserName||''}&key=UserName&title=用户名&name=${this.userInfo.UserName}`
				else if (type == '手机号变更') url =
					`type=number&value=${this.userInfo.UserPhone||''}&key=UserPhone&title=手机号&Phone=${this.userInfo.UserPhone}`
				uni.navigateTo({
					url: '/pages/User/editUserInfo?' + url
				})
			},
			logOut() {
				uni.removeStorageSync('token')
				uni.removeStorageSync('userInfo')
				uni.removeStorageSync('pass')
				uni.removeStorageSync('agree')
				uni.reLaunch({
					url: '/pages/Login/Login'
				})
			},
			// 用户头像
			onChooseAvatar(e) {
				uni.chooseImage({
					count: 1,
					sourceType: ['camera', 'album'],
					success: (rst) => {
						uni.navigateTo({
							url: '/pages/user/camera?path=' + encodeURIComponent(rst
								.tempFilePaths[0])
						})
					}
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	/deep/.uni-list-item__extra-text {
		max-width: 250px;
	}

	/deep/.uni-list-item__container {
		align-items: center;
	}

	.avatarBox {
		padding: 0 10px;
		display: flex;
		margin-bottom: 20rpx;

		.avatar-wrapper {
			background-color: transparent;
			width: 50px;
			height: 50px;
			padding: 0;
			border-radius: 5px;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.infoBox {
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			margin-left: 10px;
			font-size: 12px;

			.user {
				font-weight: 600;
				color: #333;
				font-size: 16px;
			}
		}

	}

	.msg {
		position: absolute;
		right: 25px;
		top: 10px;
	}

	.version {
		width: 100vw;
		text-align: center;
		color: #bab8b8;
		position: absolute;
		bottom: 10px;
	}

	.container {
		padding-top: 10px;
		.codeImg {
			width: 20px;
			height: 20px;
			vertical-align: bottom;
		}

		.item {
			.uni-select-multiple-item {
				background: #438FE8;
				margin-right: 5px;
				padding: 2px 4px;
				border-radius: 4px;
				color: #909399;
				display: flex;
				font-size: 28rpx;
				margin-right: 20rpx;
				margin-bottom: 20rpx;

				/* 删除按钮样式*/
				.close-icon {
					height: 100%;
					width: 20px;
					display: flex;
					align-items: center;
					justify-content: center;
					z-index: 3;
					cursor: pointer;

					text {
						position: relative;
						background: #fff;
						width: 13px;
						height: 13px;
						border-radius: 50%;
						border: 1px solid #bbb;

						&::before,
						&::after {
							content: '';
							position: absolute;
							left: 20%;
							top: 50%;
							height: 1px;
							width: 60%;
							transform: rotate(45deg);
							background-color: #909399;
						}

						&::after {
							transform: rotate(-45deg);
						}
					}
				}
			}
		}
	}
</style>